@extends("master")
@section("content")
    <div class="weui-search-bar" id="searchBar">
        <form class="weui-search-bar__form" method="get" action="/">
            <div class="weui-search-bar__box">
                <i class="weui-icon-search"></i>
                <input type="search" class="weui-search-bar__input" name="key" id="searchInput" placeholder="搜索"
                       required="">
                <a href="javascript:" class="weui-icon-clear" id="searchClear"></a>
            </div>
            <label class="weui-search-bar__label" id="searchText">
                <i class="weui-icon-search"></i>
                <span>搜索</span>
            </label>
        </form>
        <a href="javascript:" class="weui-search-bar__cancel-btn" id="searchCancel">取消</a>
    </div>
    <div class="weui-cells__title">书目</div>
    <div class="weui-cells">
        @foreach($books as $i=>$book)
            <a class="weui-cell weui-cell_access" href="{{$urls[$i]}}">
                <div class="weui-cell__bd">
                    <p>{!! $book !!}</p>
                </div>
                <div class="weui-cell__ft">
                </div>
            </a>
        @endforeach
    </div>
@endsection
@section('js')
    <script>
        weui.searchBar('#searchBar');
    </script>
@endsection